<template>
	<!-- 1. -->
	<el-container style="height: 1000px; border: 1px solid #eee">
		<el-aside width="200px" style="background-color: rgb(238, 241, 246)">
			<el-menu :default-active="$route.path" :default-openeds="['1', '3']" router>
				<el-submenu index="1">
					<template slot="title"><i class="el-icon-message"></i>商城管理系统</template>
					<el-menu-item-group>
						<template slot="title"></template>
						<el-menu-item index="/index">首页</el-menu-item>
						<el-menu-item index="/user">用户信息管理</el-menu-item>
					</el-menu-item-group>
					<el-menu-item-group title="主营业务">
						<el-menu-item index="/goodList">商品列表</el-menu-item>
						<el-menu-item index="/money">购物车</el-menu-item>
					</el-menu-item-group>
				</el-submenu>

			</el-menu>
		</el-aside>
		<el-main>
			<div>
				<el-carousel :interval="4000" type="card" height="400px" style="width: 80%;margin-left: 170px;">
				<el-carousel-item  :key="item">
					<img src="../assets/img/1.jpg" style="height: 400px; width: 650px;"/>
				</el-carousel-item>
				<el-carousel-item  :key="item">
					<img src="../assets/img/2.png" style="height: 400px; width: 650px;"/>
				</el-carousel-item>
				<el-carousel-item  :key="item">
					<img src="../assets/img/3.png" style="height: 400px; width: 650px;"/>
				</el-carousel-item>
				<el-carousel-item  :key="item">
					<h3 class="medium"></h3>
				</el-carousel-item>
			</el-carousel>
			</div>
		</el-main>
	</el-container>

</template>

<script>
export default {
	data() {
		return {

		}
	},
	created() {
		this.getuser();
		this.getGoodList(); //拉取商品数据
	}

};
</script>

<style>
/* 2. */
.el-header {
	background-color: #B3C0D1;
	color: #333;
	line-height: 60px;
}

.el-carousel__item h3 {
    color: #475669;
    font-size: 14px;
    opacity: 0.75;
    line-height: 200px;
    margin: 0;
  }
  
  .el-carousel__item:nth-child(2n) {
    background-color: #99a9bf;
  }
  
  .el-carousel__item:nth-child(2n+1) {
    background-color: #d3dce6;
  }
</style>